.invoice-manual-check {
  .ant-modal,
  &.ant-modal {
    padding-bottom: 0;
  }
  .ant-modal-content {
    border-radius: 0;
  }
  .ant-modal-close-x {
    color: $font-ghost;
    line-height: 50px;
  }
  .ant-modal-body {
    ::-webkit-scrollbar {
      display: none;
    }
    padding: 0;
    height: 100vh;
  }
  i.collapsed-icon {
    color: #ffffff;
    top: 16px;
  }
  &-left-content {
    height: 100%;
    position: relative;
    overflow: hidden;
    &-back {
      padding: 16px 20px;
      font-size: 14px;
      border-bottom: 1px solid $tag-default-border;
      position: relative;
      &-question {
        position: absolute;
        top: 20px;
        right: 20px;
        cursor: pointer;
      }
    }
    &-matched,
    &-checked {
      height: calc(100vh - 150px);
      overflow-x: hidden;
      overflow-y: auto;
    }
    &-checked {
      height: calc(100vh - 100px);
      padding: 0 20px 75px;
      &-title {
        margin-bottom: 8px;
      }
      &-success {
        color: #35956a;
        background: #eafff5;
        border: 1px solid #4dc690;
        padding: 10px;
        .anticon-check-circle {
          color: #4dc690;
        }
        .check-success-title {
          font-weight: bolder;
          margin: 0 5px 0 10px;
        }
      }
      &-text {
        .text-row {
          min-height: 32px;
          margin-bottom: 16px;
          .text-col-title {
            color: #4e5b71;
            font-size: 12px;
            line-height: 16px;
            margin-top: 8px;
          }
          .text-col-content {
            line-height: 20px;
            margin-top: 6px;
          }
        }
      }
      .item-selected {
        .ant-table-small,
        .ant-table table {
          box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
        }
        .ant-table-small .ant-table-thead > tr > th,
        .ant-table-small .ant-table-tbody > tr > td,
        .ant-table-footer {
          background: #eff8ff;
        }
      }
      .ant-table-small,
      .ant-table table {
        border-color: #ebf0f5;
        border-radius: 0;
      }
      .ant-table-small .ant-table-header > table,
      .ant-table-small .ant-table-body > table {
        padding: 0;
      }
      .ant-table-small .ant-table-thead > tr > th {
        border-color: #ebf0f5;
        text-align: center;
      }
      .ant-table-small .ant-table-tbody > tr > td {
        background: #fff;
        vertical-align: top;
      }
      .ant-table-footer {
        background: #fff;
        font-size: 12px;
        border-radius: 0;
      }
      .ant-table-footer:before {
        background: #ebf0f5;
      }
      .invoice-manual-check-left-content-alert {
        margin: 0 -20px;
        .anticon {
          margin: 0 5px 0 0;
        }
      }
      .ant-calendar-picker .ant-calendar-picker-input {
        line-height: 32px;
      }
      .ant-select-selection-selected-value {
        padding-right: 10px;
      }
    }
    &-alert {
      background: $background-layout;
      padding: 10px 20px;
      font-size: 12px;
      color: #8b93a7;
      background: #f7f8fa;
      .anticon {
        margin: 0 10px;
      }
      &-index {
        display: inline-block;
        width: 15px;
        height: 15px;
        line-height: 14px;
        text-align: center;
        border: 1px solid #8b93a7;
        border-radius: 50%;
      }
    }
    &-list-header {
      font-weight: bolder;
      position: relative;
      padding: 24px 20px 0;
      color: #1e2126;
      &-count {
        font-size: 12px;
        font-weight: normal;
        position: absolute;
        right: 0;
        top: 3px;
      }
    }
    &-empty {
      padding: 10px;
      margin: 8px 20px;
      border: 1px solid #ebf0f5;
      text-align: center;
      font-size: 12px;
      color: #b5c0ce;
      &-img {
        display: block;
        margin: 0 auto 4px;
      }
    }
    &-match-item {
      padding: 10px;
      border: 1px solid #ebf0f5;
      position: relative;
      &.match-success {
        color: #35956a;
        border-color: #4dc690;
        background: #eafff5;
        .anticon-check-circle {
          color: #4dc690;
        }
        .match-success-title {
          font-weight: bolder;
          margin: 0 5px 0 10px;
        }
      }
      &-content {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      &-label {
        font-size: 12px;
        line-height: 16px;
        margin-top: 7px;
      }
      &-notice {
        font-size: 12px;
        color: #fa6478;
        margin-top: 10px;
      }
      &.item-selected {
        background: #eff8ff;
        box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
      }
      .ant-input {
        width: 100%;
        height: 28px;
      }
      .ant-spin-nested-loading > div > .ant-spin-sm .ant-spin-dot {
        left: 95%;
      }
    }
    .ant-tabs-bar {
      margin-bottom: 0;
      padding-left: 20px;
    }
    .ant-tabs-content {
      margin-top: 0;
    }
    .footer-operate {
      left: 0;
      right: 0;
      text-align: right;
      padding-right: 10px;
      height: 50px;
      line-height: 50px;
      background: #fff;
      z-index: 999;
    }
    .col-left-checkbox {
      width: 16px;
      margin-right: 12px;
    }
    .col-right-content {
      width: calc(100% - 28px);
    }
    .invoice-item-cover-container {
      position: absolute;
      top: -1px;
      right: -20px;

      &-icon {
        display: block;
        width: 16px;
        height: 16px;
        margin-bottom: 2px;
      }
    }
  }
  &-right-content {
    background-color: #292929;
    position: relative;
    z-index: 2;
    &-empty {
      width: 100%;
      height: 100vh;
      padding-top: calc(50vh - 100px);
      position: absolute;
      top: 0;
      &-img {
        display: block;
        width: 160px;
        margin: 0 auto 24px;
      }
      &-info {
        text-align: center;
        color: #fff;
        opacity: 0.5;
      }
    }
    &-title {
      position: absolute;
      z-index: 3;
      width: 100%;
      padding: 0 20px 0 40px;
      height: 50px;
      line-height: 50px;
      font-size: 16px;
      color: $font-ghost;
    }
    &-subtitle {
      float: right;
      font-size: 14px;
      font-weight: normal;
    }
    &-check {
      display: inline-table;
      font-size: 14px;
      color: #ffffff;
    }
    .attachment-status-description {
      margin-left: 6px;
      vertical-align: middle;
    }
    #invoice-preview {
      padding-top: 50px;
      height: 100vh;
      & > div {
        height: 100%;
      }
      .ant-divider {
        margin: 0 20px;
        background-color: #979797;
      }
      .invoice-wrapped-box {
        position: relative;
        height: 100%;
      }
      .image-view {
        width: 100%;
        height: 100%;
      }
      .ant-modal-body {
        height: calc(100vh - 50px);
        overflow: hidden;
      }
      .attachment-area {
        height: calc(100vh - 102px);
        line-height: calc(100vh - 102px);
        background-color: #1e1e1e;
        iframe {
          height: calc(100vh - 162px);
        }
      }
      .attachment-operate {
        height: 52px;
        line-height: 52px;
      }
    }
  }
}
